<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>用水列表</title>
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<link href="../../plugins/mui/mui.min.css" rel="stylesheet" />
		<link rel="stylesheet" href="../../css/life_housekeeper/wate_index.css" />
		<script src="../../js/statistics.js"></script>
		<script src="../../js/fontset.js"></script>
		<style type="text/css">
			body{
				background: #fff;
			}
			.mui-content{
				background-color: #fff;
			}
			
		</style>
	</head>
	<body>
		<header class="mui-bar mui-bar-nav header">
		    <a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
		    <h1 class="mui-title">用水列表</h1>
		</header>
		<div class="mui-content">
			<div class="detail-list" id="detailList">
				
			</div>
		</div>
		<script src="../../plugins/mui/mui.min.js"></script>
		<script src="../../js/getApiToken.js"></script>
		<script src="../../js/md5.js"></script>
		<script src="../../plugins/template/template.js"></script>
		<script type="text/html" id="detailInfo">
			{{if detail.length}}
			{{each detail as info i}}
			<div class="detail-list-item">
				<div class="detail-list-box">
					<span class="detail-list-date">{{info.month | monthFormat}}</span>
					<span class="detail-list-nub mui-pull-right">水量：{{info.amount}}吨</span>
				</div>
				<div class="detail-list-box">
					<span class="detail-list-money">缴费金额：{{info.money}}元</span>
					{{if info.ispay}}
					<span class="detail-list-state state-pay mui-pull-right">已缴费</span>
					{{else}}
					<span class="detail-list-state state-no_pay mui-pull-right">未缴费</span>
					{{/if}}	
				</div>
			</div>
			{{/each}}
			{{else}}
			<div class="error-message mui-text-center">暂无信息</div>
			{{/if}}
		</script>
		<script type="text/javascript">
			mui.init();
			var detailList = document.getElementById("detailList");
			template.helper('monthFormat',function(month){
				if(month){
					var b1=month.substring(0,4);
					var b2=month.substring(4,6);
					var c=b1+'-'+b2;
					return c;
				}	
			});
			mui.plusReady(function(){
				var _self =plus.webview.currentWebview(),
				    code = _self.code;
				if(!code){
					return;
				}
				plus.nativeUI.showWaiting();
				var data = {
					code:code
				};
				myAjax('home/water/history_new','get',data,function(result){
					console.log(result);
					plus.nativeUI.closeWaiting();
					var res = result.data;
					var detailHtml = template('detailInfo',res);
						detailList.innerHTML = detailHtml;
				})	
			})
		</script>
	</body>
</html>
